<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- 通过link标签的href属性引入相关css文件 -->
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/index.css">
</head>
<body>
    <!-- 版心布局,就是页面的内容宽度超过页面的一半,并且显示在页面的中间 -->

    <!-- 顶部导航栏开始 -->
    <div class="header">
        <!-- 版心类 -->
        <div class="container">
            <!-- logo图片 -->
            <!-- 一个标签可以同时具有多个类名,每个类名之间使用空格隔开 -->
            <div class="logo fl">
                <a href="#"><img src="images/logo.png"/></a>
            </div>

            <!-- 导航链接 -->
            <div class="nav fl">
                <ul>
                    <li><a href="#">首页</a></li>
                    <li><a href="https://www.baidu.com">博雅游戏</a></li>
                    <li><a href="#">博雅新闻</a></li>
                    <li><a href="#">关于我们</a></li>
                    <li><a href="#">客服中心</a></li>
                    <li><a href="#">投资者关系</a></li>
                </ul>
            </div>

            <!-- 加入我们 -->
            <div class="join_us fl">加入我们</div>

            <!-- 语言 -->
            <div class="language fr">
                <a href="#">中文</a><a href="#">EN</a>
            </div>

         </div>

    </div>
    <!-- 顶部导航栏结束 -->

    <!-- 轮播图层开始 -->
    <div class="banner">
        <div class="container">
            <!-- 内部盒子 -->
            <div class="inner_box">
                <!-- 在线游戏层 -->
                <div class="online_game">
                    <!-- 上部分 -->
                    <div class="top">在线游戏</div>

                    <!-- 下部分 -->
                    <div class="bottom">
                        <a href="#"></a>
                        <a href="#"></a>
                        <a href="#"></a>
                    </div>
                </div>

                <!-- 文字描述 -->
                <p class="desc">风靡国内外的斗地主游戏，超低流量，玩法多样，居家旅行必备良品</p>

                <!-- 下载游戏 -->
                <h2>下载游戏：</h2>

                <!-- 图标层 -->
                <div class="icons">
                    <ul>
                        <li><span class="icon"></span><br/>iPad</li>
                        <li><span class="icon"></span><br/>iPhone</li>
                        <li><span class="icon"></span><br/>Android</li>
                        <li><span class="icon"></span><br/>TV</li>
                        <li><img src="images/ewm.png"/></li>
                    </ul>
                </div>

            </div>
        </div>

        <!-- 小圆点 -->
        <div class="dot">
            <ul>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
            </ul>
        </div>

    </div>
    <!-- 轮播图层结束 -->

    <!-- 宣传层开始 -->
    <!-- 一个标签可以同时具有多个类名,多个类名之间使用空格隔开,对应样式会同时生效 -->
    <div class="publicity container">
        <ul>
            <li>
                <a href="#">
                    <img src="images/bd1.jpg"/>
                    <div class="content">
                        <div class="title">博雅互动宣传视频</div>
                        <div class="play">点击播放</div>
                    </div>
                </a>
            </li>

            <li>
                <a href="#">
                    <img src="images/bd2.jpg"/>
                    <div class="content">
                        <div class="title">博雅互动宣传视频</div>
                        <div class="play">点击播放</div>
                    </div>
                </a>
            </li>

            <li>
                <a href="#">
                    <img src="images/bd3.jpg"/>
                    <div class="content">
                        <div class="title">麻将全集</div>
                        <div class="play">MAHJONG GAMES</div>
                    </div>
                </a>
            </li>

            <li>
                <a href="#">
                    <img src="images/bd4.jpg"/>
                    <div class="content">
                        <div class="title">中国象棋</div>
                        <div class="play">FOUR LANDLORDS</div>
                    </div>
                </a>
            </li>
        </ul>
    </div>
    <!-- 宣传层结束 -->

    <!-- 线开始 -->
    <div class="line container">
        <ul>
            <li></li>
            <li></li>
        </ul>
    </div>
    <!-- 线结束 -->

    <!-- 主要内容层 -->
    <!-- sup是上标标签 -->
    <div class="main">
        <div class="container">
            <!-- 博雅新闻处 -->
            <div class="boya_news">
                <div class="more">MORE<sup>+</sup></div>
                <ul>
                    <li><a href="#">博雅互动公布2018年第三季度业绩，善用成本费用控制政策，在考验中做好防守</a><span>11/22</span></li>
                    <li><a href="#">博雅互动公布2018年第三季度业绩，成本费用控制良好，股权投资收益增加，积极打造高质量的游戏及赛事产品</a><span>11/22</span></li>
                    <li><a href="#">博雅互动义工队中秋探访敬老院，带关爱走进夕阳生活</a><span>09/25</span></li>
                    <li><a href="#">博雅互动公布2018年中期业绩，巩固现有市场地位，加大力度拓展海外市场及其他棋牌游戏业务</a><span>08/23</span></li>
                </ul>
            </div>

            <!-- 社会招聘层 -->
            <div class="shehuizhaop">
                <div class="more">MORE<sup>+</sup></div>
                <h2>社会招聘</h2>
                <h3>BOYAA JOBS</h3>
                <h4>社会招聘岗位：</h4>
                <ul>
                    <li><a href="#">PHP开发工程师</a></li>
                    <li><a href="#">C++开发工程师</a></li>
                    <li><a href="#">LUA开发工程师</a></li>
                    <li><a href="#">大数据开发工程师</a></li>
                </ul>
            </div>

        </div>
    </div>

    <!-- 底部开始 -->
    <div class="footer">
        <div class="container">
            <p><a href="#">网站地图</a>  |  <a href="#">免责声明</a>  |  <a href="#">监督举报</a></p>
            <p>Copyright © 2004 - 2019 博雅互动(Boyaa Interactive)<a href="#">粤ICP备05062536号</a></p>
            <p>网络文化经营许可证：粤网文[2015]1991-405号 | 互联网出版许可证：新出网证（粤）字062号 | 增值电信业务经营许可证：粤B2-20110513  <a href="#"><img src="images/govIcon.gif"/></a></p>
        </div>
    </div>
    <!-- 底部结束 -->
</body>
</html>